<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-signInfo-edit" th:object="${signInfo}">
            <input id="signId" name="signId" th:field="*{signId}"  type="hidden">
            <div class="form-group">	
                <label class="col-sm-3 control-label">考勤日期：</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control time-input" id="signDt" name="signDt" th:value="${#dates.format(signInfo.signDt, 'yyyy-MM-dd')}" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">考勤时间：</label>
                <div class="col-sm-8 form-inline select-month">
                    <input type="text" class="form-control time-input" id="startTime" placeholder="开始时间" name="params[beginTime]" th:value="${#dates.format(signInfo.signStti, 'yyyy-MM-dd HH:mm')}" />
                    <span class="form-control text-center" style="border:0;">至</span>
                    <input type="text" class="form-control time-input" id="endTime" placeholder="结束时间" name="params[endTime]" th:value="${#dates.format(signInfo.signEdti, 'yyyy-MM-dd HH:mm')}"/>
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">证件号码：</label>
                <div class="col-sm-8">
                    <input id="empId" name="empId" th:field="*{empId}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">姓名：</label>
                <div class="col-sm-8">
                    <input id="empNm" name="empNm" th:field="*{empNm}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">项目编号：</label>
                <div class="col-sm-8">
                    <input id="proSn" name="proSn" th:field="*{proSn}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">项目名称：</label>
                <div class="col-sm-8">
                    <input id="proName" name="proName" th:field="*{proName}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">供应商编号：</label>
                <div class="col-sm-8">
                    <input id="compSn" name="compSn" th:field="*{compSn}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <div class="form-group">	
                <label class="col-sm-3 control-label">供应商名称：</label>
                <div class="col-sm-8">
                    <input id="compNm" name="compNm" th:field="*{compNm}" class="form-control" type="text" readonly="readonly">
                </div>
            </div>
            <input id="proId" name="proId" th:field="*{proId}" class="form-control" type="hidden">
            <input id="compId" name="compId" th:field="*{compId}" class="form-control" type="hidden">
		</form>
    </div>
    <div th:include="include::footer"></div>
    <script type="text/javascript">
		var prefix = ctx + "pm/signInfo";
		$("#form-signInfo-edit").validate({
			rules:{
				empId:{
					required:true,
				}
			}
		});
		
		function submitHandler() {
			if ($.validate.form()) {
	            edit();
	        }
	    }
		
		function edit() {
			var signId = $("input[name='signId']").val();
			var signStti = $("#startTime").val();
        	var signEdti = $("#endTime").val();
        	$.ajax({
        		cache : true,
        		type : "POST",
        		url : ctx + "pm/signInfo/edit",
        		data : {
        			"signId": signId,
        			"signStti": signStti,
        			"signEdti": signEdti
        		},
        		async : true,
        		error : function(request) {
        			$.modal.alertError("系统错误");
        		},
        		success : function(data) {
        			$.operate.saveSuccess(data);
        		}
        	});
        }
		
		layui.use('laydate', function(){
			var laydate = layui.laydate;
			laydate.render({
				elem: '#signDt',//或 elem: document.getElementById('test')、elem: lay('#test') 等（类型：String/DOM，默认值：无必填项，用于绑定执行日期渲染的元素，值一般为选择器，或DOM对象）
				theme: 'default',//主题-类型：String，默认值：default，theme的可选值有：default（默认简约）、molv（墨绿背景）、#颜色值（自定义颜色背景）、grid（格子主题）
		        trigger: 'click' // 自定义弹出控件的事件(类型：String，默认值：focus，如果绑定的元素非输入框，则默认事件为：click)-采用click弹出
				/*
				,type: 'year'//year-只提供年列表选择||month-只提供年、月选择||date-可选择：年、月、日。type默认值，一般可不填||time-只提供时、分、秒选择||datetime-可选择：年、月、日、时、分、秒
				,range: true //或 range: '~' 来自定义分割字符
				,format: 'yyyy年MM月dd日' //可任意组合 yyyy年MM月dd日 HH时mm分ss秒===2017年08月18日 20时08分08秒
				,value: '2018-08-18' //必须遵循format参数设定的格式String，默认值：new Date()
				,min: '2017-1-1'//min/max - 最小/大范围内的日期时间值 类型：string，默认值：min: '1900-1-1'、max: '2099-12-31'
				,max: '2017-12-31'
				,show: true //默认显示-类型：Boolean，默认值：false;;;;如果设置: true，则控件默认显示在绑定元素的区域。通常用于外部事件调用控件
				,position: 'static'//类型：String，默认值：absolute  (fixed,absolute,static)
				,zIndex: 99999999//层叠顺序-类型：Number，默认值：66666666一般用于解决与其它元素的互相被遮掩的问题。如果 position 参数设为 static 时，该参数无效
				,showBottom: false//是否显示底部栏--类型：Boolean，默认值：true如果设置 false，将不会显示控件的底部栏区域
				,btns: ['clear', 'now', 'confirm']//类型：Array，默认值：['clear', 'now', 'confirm'](显示清空，今天，确认)
				,lang: 'en'//语言类型：String，默认值：cn--内置了两种语言版本：cn（中文版）、en（国际版，即英文版）
				,calendar: true//是否显示公历节日--类型：Boolean，默认值：false
				,mark: {//标注重要日子--类型：Object，默认值：无
				  '0-10-14': '生日'
				  ,'0-12-31': '跨年' //每年12月31日
				  ,'0-0-10': '工资' //每个月10号
				  ,'2017-8-15': '' //具体日期
				  ,'2017-8-20': '预发' //如果为空字符，则默认显示数字+徽章
				  ,'2017-8-21': '发布'
				}
				,ready: function(date){//控件在打开时触发，回调返回一个参数
				  console.log(date); //得到初始的日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
				}
				,change: function(value, date, endDate){//日期时间被切换后的回调
				  console.log(value); //得到日期生成的值，如：2017-08-18
				  console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
				  console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
				}
				,done: function(value, date, endDate){//控件选择完毕后的回调---点击日期、清空、现在、确定均会触发。
				  console.log(value); //得到日期生成的值，如：2017-08-18
				  console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
				  console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
				}
		        */
			});
		});
		
		// laydate 时间控件绑定
		layui.use('laydate', function() {
		    var laydate = layui.laydate;
		    var startDate = laydate.render({
		        elem: '#startTime',
		        max: $('#endTime').val(),
		        theme: 'default',
		        type: 'datetime',
	        	format: 'yyyy-MM-dd HH:mm',
		        trigger: 'click'
		    });
		    var endDate = laydate.render({
		        elem: '#endTime',
		        min: $('#startTime').val(),
		        theme: 'default',
		        type: 'datetime',
	        	format: 'yyyy-MM-dd HH:mm',
		        trigger: 'click'
		    });
		});
		
	</script>
</body>
</html>
